<template>
  <el-dialog :close-on-click-modal="false" v-model="isShow">
    <template #title>
      <div class="card-header">
        <i
            class="el-icon-edit-outline title-icon"
        ></i>
        <span class="title-font">{{title}}</span>
      </div>
      <el-divider></el-divider>
    </template>
    <el-form label-position="right" ref="dataForm" :rules="rules" label-width="110px" :model="dataForm">
      <el-form-item label="机构名称" prop="deptName">
        <el-input :readonly="isView" v-model="dataForm.deptName" placeholder="机构名称"></el-input>
      </el-form-item>
      <el-form-item label="所属公司" prop="companyId">
        <select-company :disabled="isView" :destroy="isShow" is-company v-model:value="dataForm.companyId" v-model:name="dataForm.companyName" placeholder="所属公司"></select-company>
      </el-form-item>
      <el-form-item label="是否是公司" prop="isCompany">
        <el-radio-group :disabled="isView" v-model="dataForm.isCompany">
          <el-radio  :label="0">否</el-radio>
          <el-radio  :label="1">是</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>


    <template #footer>
      <span class="dialog-footer">
        <el-button v-loading="loading" @click="close">取 消</el-button>
        <el-button v-loading="loading" type="primary" v-if="!isView" @click="save">保 存</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script>
import VueUtil from "@/util/VueUtil";
import {NuoDeptController} from "@/actions/controller";
import selectCompany from '@/components/dept/select-organization'
export default {
  name: "dept-add-update-form",
  components:{
    selectCompany
  },
  data(){
    return{
      isShow: false,
      isView: true,
      loading: false,
      title: '',
      dataForm: {
        deptName: '',
        companyId: '',
        companyName: '',
        isCompany: 0,
        pid: "0"
      },
      rules: {
        deptName: [
          { required: true, message: '机构名称不能为空', trigger: 'blur' },
          { min: 1, max: 64, message: '机构名称长度为1 - 64个字符', trigger: 'blur' }
        ],
        companyId: [
          { required: true, message: '公司不能为空', trigger: 'blur' },
        ]
      }
    }
  },
  emits:["reload"],
  methods:{
    init(title,data,isView = false){
      this.$nextTick(()=>{
        if(this.$refs.dataForm) this.$refs.dataForm.clearValidate()
      })
      this.title = title
      if(data) {
        Object.assign(this.dataForm,data)
      }
      this.isView = isView
      this.isShow = true
    },
    save(){
      this.$refs.dataForm.validate((valid) => {
        if (valid) {
          this.loading = true
          VueUtil(this).ajax(NuoDeptController.saveDept,this.dataForm).then(res=>{
            VueUtil(this).hint(res.message)
            this.$emit("reload")
            this.close()
          }).catch(()=>{
            this.loading = false
          })
        } else {
         this.$message.warning("请完善表单")
        }
      });
    },
    close(){
      Object.assign(this.$data, this.$options.data());
    }
  }
}
</script>

<style scoped>

</style>